<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>甲午签约</title>


<style type="text/css">
body{
	font-family:"微软雅黑";
	font-size:12px;
}
*{
	border:0px;
	margin:0px;
	padding:0px;
}
.bg{
	background: url(imagse/6.jpg);
	width:1920px;
	height:800px;
	position:relative;
}
form{
	width:600px;
	height:450px;
	margin:50px auto;
	padding-left:30px;
	position:absolute;
	left:48%;
	top:10%;
}
h2{
	margin:16px 0px;
	text-align: center;
}
p{
	margin-bottom:25px;
}
p span{
	width:80px;
	display:inline-block;
	text-align:right;
}
p input{
	width:200px;
	height:18px;
	border:1px solid  #CCC;
	padding:2px;
}
.lucky input{
	width:100px;
	height:24px;
}

.btn input{
    margin-left:75px;
    border-radius:5px;
    font-weight:bolder;
    font-family:"微软雅黑";
    display: block;
    background-color: #999999;
    color: #ffffff;
    width:100px;
    height:30px;
    border-radius: 24px;
    font-size: 18px
        
}


</style>

</head>
<body>
<div class="bg">
<form action="#" method="get" autocomplete="off">
<h2></h2>
<p><span>用户名登录：</span><input type="text" name="user_name" value="myemail@163.com" disabled readonly />
（不能修改，只能查看！）</p>
<p><span>真实姓名：</span><input type="text" name="rela_name"  pattern="^[\u4e00-\u9fa5]{0,}$" placeholder="例如：钟世志" required autofocus/>（必须填写，只能输入汉字）</p>
<p><span>真实年龄：</span><input type="number" name="real_lage" value="24" min="15" max="120" required/>(必须填写）</p>
<p><span>出生日期：</span><input type="date" name="birthday" value="1997-7-7" required/>(必须填写）</p>
<p><span>电子邮箱：</span><input type="email" name="myemail" placeholder="<975642055@qq.com>
" required multiple/>(必须填写）</p> 
<p><span>身份证号：</span><input type="text" name="card" required pattern="^\d{8,18}|[0-9x]{8,18}|[0-9x]{8,18}?$" placeholder="45xxxxx"/>
（必须填写，能够以数字、字母X结尾的短身份证号）</p> 
<p><span>手机号码：</span><input type="tel" name="telphone" pattern="^\d{11}$" placeholder="15878540885" required/>(必须填写）</p>
<p><span>个人主页：</span><input type="url" list="grzy" placeholder="例如：zsz.cn"/> (请选择网址）
<datalist id="grzy">
 <option value="http://www.163.com"></option>
 <option value="http://www.hao123.com"></option>
 <option value="http://www.gxsdxy.com"></option>
</datalist>
</p>
<p class="lucky">兴趣爱好：
  <select name="aihao" class="lucky">
  <option value="游泳">游泳</option>
  <option value="听歌">听歌</option>
  <option value="写作">写作</option>
  <option value="蓝球">蓝球</option>
  <option value="跑步">跑步</option>
</select></p>（请选择你喜欢的）</p>
<p class="btn">
<input type="submit" value="提交"/><br/><br/>
<input type="reset" value="重置"/>
</p>
</form>





</body>
</html>
